<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>免费评估</title>
        <link rel="stylesheet" href="./css/reset.css" />
        <link rel="stylesheet" href="./css/global.css" />
        <link rel="stylesheet" href="./css/element-ui.css" />
        <link rel="stylesheet" href="https://unpkg.com/mint-ui/lib/style.css" />
        <link rel="stylesheet" href="./css/evaluate.css" />
        <script src="./js/adapter.js"></script>
    </head>
    <body>
        <div id="app">
            <div class="bg">
                <img src="./img/bg.png" class="bg" />
            </div>
            <div class="title"></div>
            <div class="search_page" v-if="status">
                <div class="form_item_info">
                    <div class="content_title_wrap">
                        <div class="title_line"></div>
                        <div class="content_title fs16">联系方式</div>
                    </div>
                    <div class="content">
                        <div class="item">
                            <div class="item_title fs14">客户姓名</div>
                            ：
                            <div class="picker myfc-1 fs14">
                                <input
                                    placeholder="请输入"
                                    v-model="customerName"
                                />
                            </div>
                        </div>
                        <div class="item">
                            <div class="item_title fs14">联系电话</div>
                            ：
                            <div class="picker myfc-1 fs14">
                                <input
                                    placeholder="请输入"
                                    v-model="phoneNumber"
                                />
                            </div>
                        </div>
                        <div class="item">
                            <div class="item_title fs14">详细地址</div>
                            ：
                            <div class="picker myfc-1 fs14">
                                <input
                                    placeholder="建议您按照房本信息填写"
                                    v-model="address"
                                />
                            </div>
                        </div>
                    </div>
                    <div class="content_title_wrap">
                        <div class="title_line"></div>
                        <div class="content_title fs16">房屋详细</div>
                    </div>
                    <div class="content">
                        <div class="item">
                            <div class="item_title fs14">区域</div>
                            ：
                            <div
                                class="picker myfc-1 fs14"
                                @click="districtNameShow=true"
                            >
                                <div v-if="!districtName">请选择区域</div>
                                <div v-else>{{districtName}}</div>
                                <div>
                                    <i class="el-icon-arrow-right"></i>
                                </div>
                            </div>
                        </div>
                        <div class="item" v-if="districtName=='和平'">
                            <div class="item_title fs14">学区</div>
                            ：
                            <div
                                class="picker myfc-1 fs14"
                                @click="schoolInfoShow=true"
                            >
                                <div v-if="!schoolInfo">请选择学区</div>
                                <div v-else>{{schoolInfo}}</div>
                                <div>
                                    <i class="el-icon-arrow-right"></i>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="item_title fs14">房型</div>
                            ：
                            <div
                                class="picker myfc-1 fs14"
                                @click="houseTypeShow=true"
                            >
                                <div v-if="!houseType">请选择房型</div>
                                <div v-else>{{houseType}}</div>
                                <div>
                                    <i class="el-icon-arrow-right"></i>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="item_title fs14">产别</div>
                            ：
                            <div
                                class="picker myfc-1 fs14"
                                @click="ownerShipShow=true"
                            >
                                <div v-if="!ownerShip">请选择产别</div>
                                <div v-else>{{ownerShip}}</div>
                                <div>
                                    <i class="el-icon-arrow-right"></i>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="item_title fs14">朝向</div>
                            ：
                            <div
                                class="picker myfc-1 fs14"
                                @click="orientationShow=true"
                            >
                                <div v-if="!orientation">请选择朝向</div>
                                <div v-else>{{orientation}}</div>
                                <div>
                                    <i class="el-icon-arrow-right"></i>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="item_title fs14">结构</div>
                            ：
                            <div
                                class="picker myfc-1 fs14"
                                @click="structureShow=true"
                            >
                                <div v-if="!structure">请选择结构</div>
                                <div v-else>{{structure}}</div>
                                <div>
                                    <i class="el-icon-arrow-right"></i>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="item_title fs14">物业</div>
                            ：
                            <div
                                class="picker myfc-1 fs14"
                                @click="propertyShow=true"
                            >
                                <div v-if="!property">请选择物业类型</div>
                                <div v-else>{{property}}</div>
                                <div>
                                    <i class="el-icon-arrow-right"></i>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="item_title fs14">装修</div>
                            ：
                            <div
                                class="picker myfc-1 fs14"
                                @click="renovationShow=true"
                            >
                                <div v-if="!renovation">请选择装修情况</div>
                                <div v-else>{{renovation}}</div>
                                <div>
                                    <i class="el-icon-arrow-right"></i>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="item_title fs14">楼层</div>
                            ：
                            <div
                                class="picker myfc-1 fs14"
                                @click="floorShow=true"
                            >
                                <div v-if="!floor">请选择</div>
                                <div v-else>{{floor}}</div>
                                <div>
                                    <i class="el-icon-arrow-right"></i>
                                </div>
                            </div>
                        </div>

                        <div class="item" style="border-bottom: 0">
                            <div class="item_title fs14">面积</div>
                            ：
                            <div class="picker myfc-1 fs14">
                                <input
                                    v-model="area"
                                    :placeholder="ownerShip=='公产房'||ownerShip=='使用权房'?'请输入计租面积':'请输入建筑面积'"
                                />
                                <div>m²</div>
                            </div>
                        </div>
                        <div class="info_tip">
                            提示:如为伙用请用该公式计算面积:独用+伙用/伙用户数
                        </div>
                        <div class="item">
                            <div class="item_title fs14">房本编号</div>
                            ：
                            <div class="picker myfc-1 fs14">
                                <input
                                    placeholder="请输入17位房本编号"
                                    v-model="houseId"
                                />
                            </div>
                        </div>
                    </div>
                </div>
                <button class="submit_btn fs16" @click="submit">
                    发布房源
                </button>
            </div>
            <div class="result_top" v-else>
                <div class="search_page">
                    <div class="ad_title fs25">我的房子值多少钱</div>
                    <div class="ad_content fs14">时刻关注房子价值信息</div>
                    <div class="more_btn fs16" @click="addHouse">再估一套</div>
                    <div class="tip_info fs14">
                        估价由津房置换根据最近交易信息提供
                    </div>
                </div>
                <div class="content">
                    <div class="content_title_wrap ml10">
                        <div class="title_line"></div>
                        <div class="content_title fs16">我的估价历史</div>
                    </div>
                    <div class="list">
                        <ul>
                            <li v-for="(item,index) in houseList" :key="index">
                                <div class="name fs14">{{item.address}}</div>
                                <div class="house_item_info">
                                    <div class="floor">
                                        区域：<span>{{item.district}}</span>
                                    </div>
                                    <div class="floor">
                                        面积：<span>{{item.area}}</span>
                                    </div>
                                    <div class="floor">
                                        房型：<span>{{item.houseLayout}}</span>
                                    </div>
                                    <div class="floor">
                                        楼层：<span>{{item.floor}}</span>
                                    </div>
                                    <div class="floor">
                                        朝向：<span
                                            >{{item.houseOrientation}}</span
                                        >
                                    </div>
                                    <div class="floor">
                                        产别：<span>{{item.ownerShip}}</span>
                                    </div>
                                </div>
                                <div class="tip myfc-2 fs10">
                                    请您保持手机畅通，等到我们工作人员的联系
                                </div>
                                <div class="button_group">
                                    <div
                                        class="btn bg_green"
                                        @click="handleLease(item.id,'lease')"
                                        v-if="!item.isRent"
                                    >
                                        出租房屋
                                    </div>
                                    <div
                                        class="btn bg_green_no"
                                        @click="handleLease(item.id,'noLease')"
                                        v-else
                                    >
                                        取消出租
                                    </div>
                                    <div
                                        class="btn bg_blue"
                                        @click="handleSell(item.id,'sell')"
                                        v-if="!item.isSell"
                                    >
                                        出售房屋
                                    </div>
                                    <div
                                        class="btn bg_blue_no"
                                        @click="handleSell(item.id,'noSell')"
                                        v-else
                                    >
                                        取消出售
                                    </div>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            <!-- 区域 -->
            <mt-popup
                v-model="districtNameShow"
                popup-transition="popup-fade"
                position="bottom"
            >
                <div class="pop_content">
                    <div class="head fs16">
                        <div></div>
                        <div class="fc-7" @click="districtConfirm()">确定</div>
                    </div>
                    <mt-picker
                        :slots="districtList"
                        @change="onChangeDistrict"
                        :visible-item-count="3"
                    ></mt-picker>
                </div>
            </mt-popup>
            <!-- 学区 -->
            <mt-popup
                v-model="schoolInfoShow"
                popup-transition="popup-fade"
                position="bottom"
            >
                <div class="pop_content">
                    <div class="head fs16">
                        <div></div>
                        <div class="fc-7" @click="schoolInfoConfirm()">
                            确定
                        </div>
                    </div>
                    <mt-picker
                        :slots="schoolInfoList"
                        @change="onChangeSchoolInfo"
                        :visible-item-count="3"
                    ></mt-picker>
                </div>
            </mt-popup>
            <!-- 房型 -->
            <mt-popup
                v-model="houseTypeShow"
                popup-transition="popup-fade"
                position="bottom"
            >
                <div class="pop_content">
                    <div class="head fs16">
                        <div></div>
                        <div class="fc-7" @click="houseTypeConfirm()">确定</div>
                    </div>
                    <mt-picker
                        :slots="houseTypeList"
                        @change="onChangeHouseType"
                        :visible-item-count="3"
                    ></mt-picker>
                </div>
            </mt-popup>
            <!-- 产别 -->
            <mt-popup
                v-model="ownerShipShow"
                popup-transition="popup-fade"
                position="bottom"
            >
                <div class="pop_content">
                    <div class="head fs16">
                        <div></div>
                        <div class="fc-7" @click="ownerShipConfirm()">确定</div>
                    </div>
                    <mt-picker
                        :slots="ownerShipList"
                        @change="onChangeOwnerShip"
                        :visible-item-count="3"
                    ></mt-picker>
                </div>
            </mt-popup>
            <!-- 朝向 -->
            <mt-popup
                v-model="orientationShow"
                popup-transition="popup-fade"
                position="bottom"
            >
                <div class="pop_content">
                    <div class="head fs16">
                        <div></div>
                        <div class="fc-7" @click="orientationConfirm()">
                            确定
                        </div>
                    </div>
                    <mt-picker
                        :slots="orientationList"
                        @change="onChangeOrientation"
                        :visible-item-count="3"
                    ></mt-picker>
                </div>
            </mt-popup>
            <!-- 结构 -->
            <mt-popup
                v-model="structureShow"
                popup-transition="popup-fade"
                position="bottom"
            >
                <div class="pop_content">
                    <div class="head fs16">
                        <div></div>
                        <div class="fc-7" @click="structureConfirm()">确定</div>
                    </div>
                    <mt-picker
                        :slots="structureList"
                        @change="onChangeStructure"
                        :visible-item-count="3"
                    ></mt-picker>
                </div>
            </mt-popup>
            <!-- 物业 -->
            <mt-popup
                v-model="propertyShow"
                popup-transition="popup-fade"
                position="bottom"
            >
                <div class="pop_content">
                    <div class="head fs16">
                        <div></div>
                        <div class="fc-7" @click="propertyConfirm()">确定</div>
                    </div>
                    <mt-picker
                        :slots="propertyList"
                        @change="onChangeProperty"
                        :visible-item-count="3"
                    ></mt-picker>
                </div>
            </mt-popup>
            <!-- 装修 -->
            <mt-popup
                v-model="renovationShow"
                popup-transition="popup-fade"
                position="bottom"
            >
                <div class="pop_content">
                    <div class="head fs16">
                        <div></div>
                        <div class="fc-7" @click="renovationConfirm()">
                            确定
                        </div>
                    </div>
                    <mt-picker
                        :slots="renovationList"
                        @change="onChangeRenovation"
                        :visible-item-count="3"
                    ></mt-picker>
                </div>
            </mt-popup>
            <!-- 楼层 -->
            <mt-popup
                v-model="floorShow"
                popup-transition="popup-fade"
                position="bottom"
            >
                <div class="pop_content">
                    <div class="head fs16">
                        <div></div>
                        <div class="fc-7" @click="floorConfirm()">确定</div>
                    </div>
                    <mt-picker
                        :slots="floorList"
                        @change="onMultiChange"
                        :visible-item-count="3"
                    ></mt-picker>
                </div>
            </mt-popup>
        </div>
        <script src="./plugins/vue.min.js"></script>
        <script src="./plugins/axios.min.js"></script>
        <!-- 引入组件库 -->
        <script src="./plugins/element-ui.min.js"></script>
        <script src="https://unpkg.com/mint-ui/lib/index.js"></script>
        <script src="./utils/baseUrl.js"></script>
        <script src="./js/evaluate.js"></script>
    </body>
</html>
